import * as React from 'react';
import * as ReactDOM from 'react-dom';
import * as Mycss from "../CSS/mycss.css";
import * as Global from '../TS/Global';
interface WaitingProps extends Global.Myprops {


};

interface WaitingState {
    Language?: string;
    timeoutnum?: number;
    Isjump?: boolean;
};

class Waiting extends React.Component<WaitingProps,
    WaitingState> {
    constructor(props) {
        super(props);
        //设置状态
        this.state = {
            Language: $.cookie('Language')
                ? $.cookie('Language')
                : "zh",
            timeoutnum: 45,
            Isjump: false
        };
        this.Reboot();
        setInterval(function () {
            this.setState({ timeoutnum: this.state.timeoutnum - 0.1 }, () => {
                if (this.state.timeoutnum <= 13 && this.state.Isjump == false
                ) {
                    window.location.href = 'index.html';
                    this.setState({ Isjump: true });
                }

            });


        }.bind(this), 100);


    }

    //执行命令
    Reboot(): void {
        //应用 配置
        //let control: any = this.refs.loading;
        //control.ReciveMsgEvent(this, "ShowText", Global.GetLocal("设备重启中"));
        let promise = new Promise(function (resolve, reject) {

            $.ajax({
                url: "WebService.cgi",

                type: 'post',
                error: (xhr, status, error) => {
                    reject(error);
                },
                contentType: "application/x-www-form-urlencoded",
                data: {
                    datafrom: 'common',
                    jsondata: JSON.stringify({ cmd: "Reboot" })
                },
                dataType: "json", //dataType: "jsonp", jsonp: "callback", jsonpCallback:
                // "success_jsonpCallback",
                success: (result) => {

                }
            });
        });
        promise.then((results) => {
            console.log("重启命令发送完成:");
            console.log(results);

        }, (errors) => {
            console.log("重启命令发送失败:");
            console.log(errors);
        }).catch();
    }
    //下一步进行显示 进行初始化
    componentDidMount() {
        //类似window.onload
        this.setState((prv, prop) => ({
            // count: this.state.count + 1
        }));
    }
    componentWillReceiveProps(nextProps) {
        //每次父控件重新绘制,赋值新的props触发
        this.setState({});
    }
    public handleClick(e: React.MouseEvent<any>): void { }
    public handleChange(event: any): void {

        console.log(event.target.value);
    }
    public render(): JSX.Element {
        let str: string = "";
        if (this.state.Language == "zh") {
            str = "上传文件成功,请等待设备重启,倒计时:" + Math.floor(this.state.timeoutnum) + "秒";
        }
        else
            str = "The upload file is successful, please wait for the device to restart. The countdown:" + Math.floor(this.state.timeoutnum) + "second";
        let num = (45 - this.state.timeoutnum) * 100 / 45;
        let numstr = num.toString() + '%';
        var mystyle = {
            width: numstr
        };

        return (

            <div className={Mycss.Center_flex}>

                < div className="alert alert-success col-xs-12 col-sm-8 center-block" role="alert" >
                    <div
                        id="Waiting"
                    >
                        {str}
                    </div>

                    <div className="progress">
                        <div className="progress-bar progress-bar-info progress-bar-striped" style={mystyle}
                            aria-valuemax="100">

                        </div>
                    </div>

                </div >
            </div>
        );
    }
}

export default Waiting;
ReactDOM.render(
    <Waiting />, document.getElementById('contenter') as HTMLElement, () => { });